﻿@{
    Layout = "~/Views/Shared/Main.cshtml";
}

@section  PageStyleFile{
    <link rel="stylesheet" type="text/css" href="~/assets/global/plugins/select2/select2.css" />
    <link rel="stylesheet" type="text/css" href="~/assets/global/plugins/bootstrap-select/bootstrap-select.min.css"/>
    <link rel="stylesheet" type="text/css" href="~/assets/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.css" />
	<link rel="stylesheet" type="text/css" href="~/assets/global/plugins/jquery-file-upload/css/jquery.fileupload.css"/>
	<link rel="stylesheet" type="text/css" href="~/assets/admin/pages/css/user.css"/>
	<link rel="stylesheet" type="text/css" href="~/assets/admin/pages/css/userdetail.css"/>
}

@section PageScriptFile{
    <script type="text/javascript" src="~/assets/global/plugins/select2/select2.min.js"></script>
    <script type="text/javascript" src="~/assets/global/plugins/bootstrap-select/bootstrap-select.min.js"></script>
	<script type="text/javascript" src="~/assets/global/plugins/jquery-file-upload/js/jquery.fileupload.js"></script>
	<script type="text/javascript" src="~/assets/global/plugins/jquery-upload-preview/jquery.uploadPreview.js"></script>
    <script type="text/javascript" src="~/assets/global/plugins/jquery-validation/js/jquery.validate.min.js"></script>
    <script type="text/javascript" src="~/assets/global/plugins/jquery-validation/js/additional-methods.min.js"></script>
    <script type="text/javascript" src="~/assets/admin/pages/scripts/user.js"></script>
	<script type="text/javascript" src="~/assets/admin/pages/scripts/userdetail.js"></script>
}

@section PageScript{
    <script type="text/javascript">
        jQuery(document).ready(function () {
            User.init();
        });
    </script>
}

<div class="col-md-12">
    <div class="portlet light">
        <div class="table-toolbar">
            <div class="row">
                <div class="col-md-9">
                    <form class="form-inline" trigger-id="btnSearch" role="form">
                        <div class="btn-group">
                            <button id="btnOperation" type="button" class="btn blue dropdown-toggle" data-toggle="dropdown">
                                操作 <i class="fa fa-angle-down"></i>
                            </button>
                            <ul class="dropdown-menu" role="menu" aria-labelledby="btnOperation">
								<li>
                                    <a href="#append_to_group_panel" data-toggle="modal"><i class="fa fa-share-alt"></i> 添加到组 </a>
                                </li>
								<li>
                                    <a href="#reset_password_panel" data-toggle="modal"><i class="fa fa-key"></i> 密码重置 </a>
                                </li>
                                <li class="divider"></li>
                                <li>
                                    <a href="#delete_users_panel" data-toggle="modal"><i class="fa fa-remove"></i> 删除用户 </a>
                                </li>
                            </ul>
                        </div>
                        <div class="form-group">
                            <select id="ddlGroups" class="bs-select form-control input-xsmall" data-style="blue">
								@foreach(TBM.Models.Group item in ViewBag.Groups){
									<option value="@item.GID">@item.GroupName</option>
								}
                            </select>
                        </div>
                        <div class="form-group">
                            <div class="input-group dropdown">
								<div id="ddlFilter" class="input-group-addon dropdown-toggle tooltips" data-toggle="dropdown" data-original-title="修改用户状态筛选条件"><i class="fa fa-filter"></i></div>
								<ul class="dropdown-menu" role="menu" aria-labelledby="ddlFilter">
									<li>
										<a href="javascript:;"><label><input type="radio" value="" checked="checked" name="ddlFilter" /> 默认 </label></a>
									</li>
									<li>
										<a href="javascript:;"><label><input type="radio" value="1" name="ddlFilter" /> 正常 </label></a>
									</li>
									<li>
										<a href="javascript:;"><label><input type="radio" value="0" name="ddlFilter" /> 停用 </label></a>
									</li>
								</ul>
                                <input id="txtLikeName" class="form-control" type="text" placeholder="用户搜索">
                                <span class="input-group-btn">
                                    <button id="btnSearch" class="btn green">
                                        <i class="icon-magnifier"></i>
                                    </button>
                                </span>
                            </div>
                        </div>
                        <div class="btn-group">
                            <a id="new_user" href="#new_user_panel" data-toggle="modal" class="btn green">
                                添加用户 <i class="fa fa-plus"></i>
                            </a>
                        </div>
                    </form>
                </div>
                <div class="col-md-3">
                    <div class="btn-group pull-right">
                        <button class="btn dropdown-toggle" data-toggle="dropdown">
                            工具 <i class="fa fa-angle-down"></i>
                        </button>
                        <ul class="dropdown-menu pull-right">
                            <li>
                                <a href="~/User/ExportUsers"><i class="fa fa-file-excel-o"></i> 导出 Excel </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
		<div id="table_content" class="panel-relative">
			@Html.Partial("IndexTable")
		</div>
    </div>
</div>

<!--重置用户密码-->
<div class="modal fade bs-modal-sm" id="reset_password_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">重置用户密码</h4>
			</div>
			<div class="modal-body">
				<form id="resetPasswordForm" trigger-id="btnResetPassword" role="form" action="~/user/ResetUsersPassword?ajax=true" method="post">
					<div id="txtConfirmPwd" class="input-icon">
						<i class="fa fa-key"></i>
						<input type="password" class="form-control" placeholder="需要确认您的登陆密码">
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button id="btnResetCancel" type="button" class="btn default" data-dismiss="modal">取消</button>
				<button id="btnResetPassword" type="button" class="btn blue">重置密码</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<!--删除账户-->
<div class="modal fade bs-modal-sm" id="delete_users_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">删除账户</h4>
			</div>
			<div class="modal-body">
				<form id="deleteUsersForm" trigger-id="btnDeleteConfirm" role="form" action="~/user/Delete?ajax=true" method="post">
					<div class="alert alert-warning">
						<ol class="alert-ol">
							<li>被删除的账户将无法恢复，请慎重选择！</li>
							<li>当前账户不允许被删除！</li>
						</ol>
					</div>
					<div id="txtConfirmPwd_Delete" class="input-icon">
						<i class="fa fa-key"></i>
						<input type="password" class="form-control" placeholder="需要确认您的登陆密码">
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button id="btnDeleteCancel" type="button" class="btn default" data-dismiss="modal">取消</button>
				<button id="btnDeleteConfirm" type="button" class="btn blue">删除账户</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<!--创建用户表单-->
<div class="modal fade" id="new_user_panel" tabindex="-1" role="new_user_panel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header portlet light">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">
					<div class="caption font-red-sunglo">
						<span class="caption-subject bold uppercase">创建用户</span>
					</div>
				</h4>
			</div>
			<div class="modal-body portlet light">
				<div class="form">
					<form id="addUserForm" trigger-id="btnCreate" role="form" class="form-horizontal" action="~/user/add?ajax=true" method="post">
						<div class="form-body">
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* 用户ID</label>
								<div class="col-md-10">
									<div class="input-icon">
										<input name="uid" type="text" autocomplete="off" class="form-control" placeholder="用户ID">
										<div class="form-control-focus">
										</div>
										<span class="help-block">不可重复，请使用字母数字及下划线组成ID，下划线不可为首字符，字符数3-15</span>
										<i class="fa fa-user"></i>
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* 密码</label>
								<div class="col-md-10">
									<div class="input-icon">
										<input name="password" type="text" autocomplete="off" class="form-control" placeholder="密码">
										<div class="form-control-focus">
										</div>
										<span class="help-block">请输入至少6位的有效密码</span>
										<i class="fa fa-key"></i>
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">分组</label>
								<div class="col-md-10">
									<div class="md-checkbox-inline">
										@foreach(TBM.Models.Group item in ViewBag.Groups){
											if(!String.IsNullOrEmpty(item.GID)){
												<div class="md-checkbox">
													<input type="checkbox" name="groups" id="@("chkGroup" + item.GID)" class="md-check" value="@item.GID">
													<label for="@("chkGroup" + item.GID)">
														<span class="inc"></span>
														<span class="check"></span>
														<span class="box"></span>
														@item.GroupName 
													</label>
												</div>
											}
										}
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">头像</label>
								<div class="col-md-10">
									<label for="avatar">
										<div id="image-preview" class="image-preview tooltips" data-toggle="tooltip" data-placement="right" title="点击头像从本地选择一张照片">
										</div>
									</label>
									<input id="avatar" type="file" name="avatar" class="hide">
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* 姓氏</label>
								<div class="col-md-10">
									<input type="text" name="firstname" class="form-control" placeholder="姓氏">
									<div class="form-control-focus">
									</div>
									<span class="help-block">用户的姓氏，请控制在15字以内</span>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* 名字</label>
								<div class="col-md-10">
									<input type="text" name="lastname" class="form-control" placeholder="名字">
									<div class="form-control-focus">
									</div>
									<span class="help-block">用户的名字，请控制在15字以内</span>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">是否中文名</label>
								<div class="col-md-10">
									<div class="md-radio-inline">
										<div class="md-radio">
											<input type="radio" id="isCNNameY" name="cnname" value="true" checked="checked" class="md-radiobtn">
											<label for="isCNNameY">
											<span class="inc"></span>
											<span class="check"></span>
											<span class="box"></span>
											是 </label>
										</div>
										<div class="md-radio">
											<input type="radio" id="isCNNameN" name="cnname" value="false" class="md-radiobtn">
											<label for="isCNNameN">
											<span class="inc"></span>
											<span class="check"></span>
											<span class="box"></span>
											否 </label>
										</div>
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">* Email</label>
								<div class="col-md-10">
									<div class="input-icon">
										<input type="text" name="email" class="form-control" placeholder="Email">
										<div class="form-control-focus">
										</div>
										<span class="help-block">请输入合法的Email，可用于密码找回，不可重复</span>
										<i class="fa fa-envelope-o"></i>
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">通信电话</label>
								<div class="col-md-10">
									<div class="input-icon">
										<input type="text" name="phone" class="form-control" placeholder="通信电话">
										<div class="form-control-focus">
										</div>
										<i class="fa fa-phone"></i>
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">QQ</label>
								<div class="col-md-10">
									<div class="input-icon">
										<input type="text" name="qq" class="form-control" placeholder="QQ">
										<div class="form-control-focus">
										</div>
										<i class="fa fa-qq"></i>
									</div>
								</div>
							</div>
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">状态</label>
								<div class="col-md-10">
									<div class="md-radio-inline">
										<div class="md-radio">
											<input type="radio" id="rIsActiveY" name="isactive" value="true" checked="checked" class="md-radiobtn">
											<label for="rIsActiveY">
											<span class="inc"></span>
											<span class="check"></span>
											<span class="box"></span>
											正常 </label>
										</div>
										<div class="md-radio has-error">
											<input type="radio" id="rIsActiveN" name="isactive" value="false" class="md-radiobtn">
											<label for="rIsActiveN">
											<span class="inc"></span>
											<span class="check"></span>
											<span class="box"></span>
											停用 </label>
										</div>
									</div>
								</div>
							</div>							
							<div class="form-group form-md-line-input">
								<label class="col-md-2 control-label">备注</label>
								<div class="col-md-10">
									<textarea id="txtMemo" name="memo" class="form-control" rows="3" placeholder="关于TA还是一片空白"></textarea>
									<div class="form-control-focus">
									</div>
									<span class="help-block">可以写点关于TA的备注信息，也可以选择留空</span>
								</div>
							</div>
						</div>
					</form>
				</div>
			</div>
			<div class="modal-footer">
				<button id="btnCancel" type="button" class="btn default" data-dismiss="modal">取消创建</button>
				<button id="btnCreate" type="button" class="btn blue" data-dismiss="modal">创建用户</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div><!--添加到组-->
<div class="modal fade" id="append_to_group_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
				<h4 class="modal-title">添加到组</h4>
			</div>
			<div class="modal-body">
				<form id="appendToForm" trigger-id="btnAppendToGroup" action="~/user/AppendToGroup?ajax=true" method="POST">
					<div class="alert alert-success">请勾选上需要添加到的组</div>
					<div class="form-group">
						<div class="checkbox-list">
							@foreach(TBM.Models.Group item in ViewBag.Groups){
								if(!String.IsNullOrEmpty(item.GID)){
									<label class="checkbox-inline align-left">
										<input type="checkbox" name="atgroups" id="@("chkATGroup" + item.GID)" value="@item.GID"> 
										@item.GroupName 
									</label>
								}
							}
						</div>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<button id="btnAppendCancel" type="button" class="btn default" data-dismiss="modal">取消</button>
				<button id="btnAppendToGroup" type="button" class="btn blue">添加到组</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div><!--用户详情页-->
<div class="modal fade bs-modal-lg" id="user_detail_panel" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			<div id="user_detail_panel_body" class="modal-body"></div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>